<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>E总管-计划书</title>
		<link rel="stylesheet" href="src/css/bootstrap.min.css" />
		<link rel="stylesheet" href="public/picker/bootstrap-datetimepicker.min.css" />
		<link rel="stylesheet" href="public/css/my_style.css" />
		<link rel="stylesheet" href="public/css/header.css" />
		<link rel="stylesheet" href="public/css/footer.css" />
		<link rel="stylesheet" href="css/plan_book.css" />
	</head>

	<body>
		<div id="app" v-cloak>
			<div class="my_container">
				<div class="title text-center">
					计划书
				</div>
				<div class="form">
					<form class="form-horizontal form form_date" id="register" role="form">
						<div>
							<div class="type">
								<span>受保人(被保险人的人)</span>
							</div>
							<div class="form-group">
								<label for="inputPassword1" class=" col-sm-3 control-label">姓名：</label>
								<div class="col-sm-8">
									<input type="text" class="form-control" v-model="form_data.AutoMock.Name" name="Name" placeholder="请输入姓名">
								</div>
							</div>
							<div class="form-group">
								<label for="inputEmail3" class="col-sm-3 control-label">性别：</label>
								<div class="col-sm-8">
									<label class="radio-inline">
								  <input type="radio" value="1" name="Sex" v-model="form_data.AutoMock.Sex"> 男
								</label>
									<label class="radio-inline">
								  <input type="radio" value="0" name="Sex" v-model="form_data.AutoMock.Sex"> 女
								</label>
								</div>
							</div>
							<div class="form-group">
								<label for="inputEmail3" class="col-sm-3 control-label">出生日期：</label>
								<div class="col-sm-8">
									<div class="input-group date  col-sm-12" data-date="" data-link-field="Birthday" data-link-format="yyyy-mm-dd">
										<input class="form-control" size="16" type="text" id="Birthday" value="" readonly>
										<span class="input-group-addon"><span class="glyphicon glyphicon-remove"></span></span>
										<span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span></span>
									</div>
									<input type="hidden" name="birthday" value="" /><br/>
								</div>
							</div>
							<div class="form-group">
								<label for="inputPassword1" class=" col-sm-3 control-label">国籍：</label>
								<div class="col-sm-8">
									<input type="text" class="form-control" v-model="form_data.AutoMock.International" name="International" placeholder="请输入国籍">
								</div>
							</div>
							<div class="form-group">
								<label for="inputPassword1" style="padding-left: 0;" class=" col-sm-3 control-label">目前居住地(国家/城市)：</label>
								<div class="col-sm-8">
									<input type="text" v-model="form_data.AutoMock.LiveAddress" class="form-control" name="LiveAddress" placeholder="请输入目前居住地">
								</div>
							</div>
							<div class="form-group">
								<label for="inputEmail3" class="col-sm-3 control-label">是否吸烟：</label>
								<div class="col-sm-8">
									<label class="radio-inline">
								  <input type="radio" name="IsSmoking" value="true" v-model="form_data.AutoMock.IsSmoking"> 是
								</label>
									<label class="radio-inline">
								  <input type="radio" name="IsSmoking" value="false" v-model="form_data.AutoMock.IsSmoking"> 否
								</label>
								</div>
							</div>
							<div class="form-group">
								<label for="inputEmail3" class="col-sm-3 control-label">所需保险名称：</label>
								<div class="col-sm-8">
									<select class="form-control" v-model="form_data.AutoMock.ProductID" @change="change_product(form_data.AutoMock.ProductID)">
										<option v-bind:value="item.Key" v-for="item in product_list">{{item.Value}}</option>
									</select>
								</div>
							</div>
							<div class="form-group">
								<label for="inputEmail3" class="col-sm-3 control-label">保单币别：</label>
								<div class="col-sm-8">
									<select class="form-control current_select" v-on:change="select_current($event)" v-model="form_data.AutoMock.MoneyType">
										<option v-for="item in CurrencyType" v-bind:value="item.Key">{{item.Value}}</option>
									</select>
								</div>
							</div>
							<div class="form-group">
								<label for="inputEmail3" class="col-sm-3 control-label">供款年限：</label>
								<div class="col-sm-8">
									<select class="form-control" v-model="form_data.AutoMock.PayYear">
										<option v-for="item in PayYear" v-bind:value="item.Key">{{item.Value}}</option>
									</select>
								</div>
							</div>
							<div class="form-group">
								<label for="inputPassword1" class=" col-sm-3 control-label">{{ProtectType}}：</label>
								<div class="col-sm-8" style="padding-right: 55px;">
									<input type="number" class="form-control" name="Money" v-model="form_data.AutoMock.Money">
									<span class="current_type" style="position: absolute;right: 12px;top: 50%;transform: translateY(-50%);">美元</span>
								</div>
							</div>
							<div class="form-group" v-show="IsGetMoney">
								<label for="inputEmail3" class="col-sm-3 control-label">是否提款:</label>
								<div class="col-sm-8">
									<label class="radio-inline">
								  <input type="radio" name="IsDrawing" value="true" v-model="form_data.AutoMock.IsDrawing"> 是
									</label>
									<label class="radio-inline">
									  <input type="radio" name="IsDrawing" value="false" v-model="form_data.AutoMock.IsDrawing"> 否
									</label>
								</div>
								<div class="clear"></div>
								<div class="col-sm-8 col-sm-offset-2 get_money" v-show="form_data.AutoMock.IsDrawing=='true'">
									<div class="begin_draw ">
										<div class="col-sm-6" style="width: auto;padding-right: 0;">
											从第<input type="number" name="BeginYear" v-model="form_data.AutoMock.BeginYear" />年开始，		
										</div>
										<div class="col-sm-6" style="width: auto;padding-left: 0;">
											每年提取<div style="display: inline-block;position: relative;"><input type="number" name="DrawingMoney" v-model="form_data.AutoMock.DrawingMoney" /></div><span class="current_type">美元</span>
										</div>
									</div>
								</div>
							</div>
							<div class="form-group">
								<label for="inputEmail3" class="col-sm-4 control-label">保单持有人和受保人是否为同一人：</label>
								<div class="col-sm-8">
									<label class="radio-inline">
								  <input type="radio" value="1"  v-model="isSamePeople"> 是
								</label>
									<label class="radio-inline">
								  <input type="radio" value="0" v-model="isSamePeople"> 否
								</label>
								</div>
							</div>
						</div>
						<!--受保人-->
						<div  v-show="isSamePeople==0">
							<div class="type">
								<span>保单持有者(投保的人)</span>
							</div>
							<div class="form-group">
								<label for="inputPassword1" class=" col-sm-3 control-label">姓名：</label>
								<div class="col-sm-8">
									<input type="text" class="form-control" v-model="form_data.AutoMock.PolicyName" name="PolicyName" placeholder="请输入姓名">
								</div>
							</div>
							<div class="form-group">
								<label for="inputEmail3" class="col-sm-3 control-label">性别：</label>
								<div class="col-sm-8">
									<label class="radio-inline">
								  <input type="radio" value="1" name="PolicySex" v-model="form_data.AutoMock.PolicySex"> 男
								</label>
									<label class="radio-inline">
								  <input type="radio" value="0" name="PolicySex" v-model="form_data.AutoMock.PolicySex"> 女
								</label>
								</div>
							</div>
							<div class="form-group">
								<label for="inputEmail3" class="col-sm-3 control-label">出生日期：</label>
								<div class="col-sm-8">
									<div class="input-group date  col-sm-12" data-date="" data-link-field="PolicyBirthday" data-link-format="yyyy-mm-dd">
										<input class="form-control" size="16" type="text" id="PolicyBirthday" value="" readonly>
										<span class="input-group-addon"><span class="glyphicon glyphicon-remove"></span></span>
										<span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span></span>
									</div>
									<input type="hidden" name="birthday" value="" /><br/>
								</div>
							</div>
							<div class="form-group">
								<label for="inputPassword1" class=" col-sm-3 control-label">国籍：</label>
								<div class="col-sm-8">
									<input type="text" class="form-control" v-model="form_data.AutoMock.PolicyInternational" name="PolicyInternational" placeholder="请输入国籍">
								</div>
							</div>
							<div class="form-group">
								<label for="inputPassword1" style="padding-left: 0;" class=" col-sm-3 control-label">目前居住地(国家/城市)：</label>
								<div class="col-sm-8">
									<input type="text" v-model="form_data.AutoMock.PolicyLiveAddress" class="form-control" name="PolicyLiveAddress" placeholder="请输入目前居住地">
								</div>
							</div>
							<div class="form-group">
								<label for="inputEmail3" class="col-sm-3 control-label">是否吸烟：</label>
								<div class="col-sm-8">
									<label class="radio-inline">
								  <input type="radio" name="PolicyIsSmoking" value="true" v-model="form_data.AutoMock.PolicyIsSmoking"> 是
								</label>
									<label class="radio-inline">
								  <input type="radio" name="PolicyIsSmoking" value="false" v-model="form_data.AutoMock.PolicyIsSmoking"> 否
								</label>
								</div>
							</div>
						</div>
						<!--备注-->
						<div class="form-group">
							<label for="inputPassword1" class=" col-sm-3 control-label">备注：</label>
							<div class="col-sm-8">
								<input type="text" class="form-control" v-model="form_data.AutoMock.Remark"  placeholder="请输入备注">
							</div>
						</div>
						<div class="form-group">
							<div class="col-sm-offset-3 col-sm-8">
								<button @click.prevent='Submit' class="btn btn-base" style="width: 100%;">
									确 定
                    			</button>
							</div>
						</div>
					</form>
				</div>
			</div>
			<!--footer-->
			<m_bottom :user_info="globalData.userInfo"></m_bottom>
			<!--loading-->
			<loading></loading>
			<!--确认邮箱-->
			<div class="modal my_modal fade" id="confirm_email" tabindex="-1" role="dialog">
				<div class="modal-dialog"  role="document">
					<div class="modal-content">			
						<div class="modal-body">
							<form class="form-horizontal form "  role="form">
								<div class="form-group">
									<label for="inputPassword1" class=" col-sm-3 control-label">接收邮箱：</label>
									<div class="col-sm-8">
										<input type="text" @input="email_show=false" @focus="email_show=false" class="form-control" v-model="form_data.AutoMock.UserConfirmEmail" placeholder="请输入备注">
										<p v-show="email_show" class="danger" style="padding: 10px 0;">邮箱格式不正确</p>
									</div>
								</div>
							</form>
						</div>
						<div class="modal-footer">
							<button type="button" class="btn btn-base" @click="confirm_email" data-toggle="modal" data-target="more_info" data-dismiss="modal">确定</button>
						</div>
					</div>
				</div>
			</div>
			<!--再次申请-->
			<div class="modal my_modal fade" id="more_apply" tabindex="-1" role="dialog">
				<div class="modal-dialog"  role="document">
					<div class="modal-content">			
						<div class="modal-body">
							<p>提交成功！您的请求我们已经收到，计划书在完成后会发送到您的邮箱，请注意查收！</p>
						</div>
						<div class="modal-footer">
							<button type="button" class="btn btn-base" @click="confirm_email" data-toggle="modal" data-target="more_info" data-dismiss="modal">再次申请计划书</button>
						</div>
					</div>
				</div>
			</div>
			<!--确认支付-->
			<div class="modal my_modal fade" id="confirm_pay"  tabindex="-1" role="dialog">
				<div class="modal-dialog"  role="document">
				    <div class="modal-content">
					    <div class="modal-body text-center">
					    	<p style="font-size:20px;"></p>
					    	<span></span>
					    </div>
					    <div class="modal-footer my_footer">
					        <button type="button" class="btn btn-default" data-toggle="modal" data-target="pay" data-dismiss="modal">放弃模拟</button>
					        <button type="button" class="btn btn-base" data-toggle="modal" data-target="pay" data-dismiss="modal" @click="confirm_pay">支付</button>
					    </div>
				    </div>
			  	</div>
			</div>
		</div>
		<script src="src/jquery.js"></script>
		<script src="src/vue.min.js"></script>
		<script src="public/js/comm.js"></script>
		<script src="src/js/bootstrap.min.js"></script>
		<script src="src/js/bootstrapValidator.min.js"></script>
		<script src="public/picker/bootstrap-datetimepicker.min.js"></script>
		<script src="public/picker/locales/bootstrap-datetimepicker.zh-CN.js"></script>
		<script src="public/js/header_bottom.js"></script>
		<script src="public/component/verification_code.js"></script>
		<script src="public/component/question/modal.js"></script>
		<script src="js/plan_book.js"></script>
	</body>

</html>